<template>
  <div>
    <el-dialog :title="title" :visible.sync="dialogVisible" width="30%" :append-to-body="true">
      <div>
        该用户名:
        <el-input
          style="margin-bottom:20px;width:200px"
          :rows="2"
          placeholder="请输入内容"
          v-model="nickname"
          disabled
        ></el-input>
      </div>
      <div>
        类型：
        <el-input
          style="margin-bottom:20px;width:200px"
          :rows="2"
          placeholder="请输入内容"
          v-model="outtype"
          disabled
        ></el-input>
      </div>

      <div>
        反馈内容：
        <div>&emsp;</div>
        <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="textarea"></el-input>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="jubao">确 定</el-button>
      </span>
    </el-dialog>

    <div @click="active">
      <slot></slot>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      style: String
    },
    nickname: {
      style: String
    },
    uid: {
      style: String
    },
    cid: {
      style: String,
      default: null
    },
    outtype: {
      style: String,
      default: null
    }
  },
  created() {
    this.item = this.outtype;
  },
  data() {
    return {
      dialogVisible: false,
      textarea: "",
      options: ["用户信息不合法", "评论内容不合法"],
      optionvalue: ""
    };
  },
  methods: {
    active() {
      this.dialogVisible = true;
    },
    jubao() {
      this.$axios.post("/api2/jubao/insert", {
        uid: this.uid,
        content: this.textarea,
        typetext: this.outtype,
        cid: this.cid
      });
      this.dialogVisible = false;
    }
  }
};
</script>

<style>
.select {
  margin-bottom: 20px;
}
</style>